<template>
  <el-drawer
      v-model="obj.visible"
      :title="obj.title"
      direction="rtl"
      size="50%"
  >
    <el-table :data="obj.tableData" highlight-current-row>
      <el-table-column v-for="item in obj.header" :prop="item.field_name" :label="item.field_label"/>
      <el-table-column fixed="right" min-width="120">
        <template #header>
          <el-input v-model="search" size="small" placeholder="快速筛选"/>
        </template>
        <template #default="scope">
          <el-button type="primary" v-if="obj.id===scope.row.id" disabled @click="obj.doSelectRow(scope.row)">
            已选择
          </el-button>
          <el-button type="primary" v-else @click="obj.doSelectRow(scope.row)">
            <el-icon><Select/></el-icon>
            选择
          </el-button>
        </template>
      </el-table-column>
    </el-table>
  </el-drawer>
</template>

<script setup>
import {ref, computed} from "vue";

const props = defineProps(["obj"])
const search = ref()
// const filterTableData = computed(() =>
//     tableData.filter(
//         (data) =>
//             !search.value ||
//             data.name.toLowerCase().includes(search.value.toLowerCase())
//     )
// )
</script>

<style scoped>

</style>